/*
  学习目标：React创建元素练习
*/

import React from 'react';
import ReactDOM from 'react-dom';

// const title = React.createElement('div', { id: 'box', className: 'demo' }, 'aa');
// 💥class是JS中的关键字，需要使用className代替class

// ❌ const title = React.createElement('div', { id: 'box', class: 'demo' }, 'aa');
// 💥React不处理html字符串，不会做解析
const liNode1 = React.createElement('li', null, '香蕉');
const liNode2 = React.createElement('li', null, '苹果');
const liNode3 = React.createElement('li', null, '橘子');

const ulNode = React.createElement('ul', { className: 'list' }, [liNode1, liNode2, liNode3]);
ReactDOM.render(ulNode, document.getElementById('root'));
